.user {
  background-color: #f1f1f1;
  font-size: 0.9rem;

  .user-content {
    width: 980px;
    margin: 0 auto;
    background-color: #fff;

    .uc-header {
      display: flex;
      padding: 20px 40px 0 40px;

      .uc-header-left {
        div {
          width: 200px;
          height: 200px;
        }
      }

      .uc-header-right {
        flex: 1;
        margin-left: 20px;

        .uc-name {
          display: flex;
          align-items: center;
          margin: 0 0 10px 0;
          padding-bottom: 20px;
          border-bottom: 1px solid #ccc;

          h2 {
            margin-right: 20px;
          }

          // 用户等级
          .uc-name-lv {
            margin-left: 20px;
            position: relative;

            .uc-name-lv-tag {
              background: url(../../../../../assets/images/icon2.png) no-repeat 0 9999px;
              height: 19px;
              width: 70px;
              background-position: -135px -190px;
              display: inline-block;
              overflow: hidden;
            }

            .uc-name-lv-lv {
              position: absolute;
              left: 30px;
              top: -1px;
              font-weight: bold;
              color: #e03a24;
            }
          }

          // 标签
          .uc-name-tag {
            background: url(../../../../../assets/images/icon.png) no-repeat 0 9999px;
            width: 20px;
            height: 20px;
            background-position: -41px -57px;
            display: inline-block;
            overflow: hidden;
          }

          div {
            margin-left: 20px;
          }

          .uc-name-mf {
            padding: 5px 10px;
            box-shadow: 0 0 2px #eee;
            border-radius: 4px;
            display: flex;
            align-items: center;
            i {
              margin-right: 5px;
            }
          }

          // 发私信
          .uc-name-msg {
            border: 1px solid #ccc;
            background-color: #f1f1f1;
            color: #444;
          }

          // 关注
          .uc-name-follow {
            background-color: #3f8dd7;
            color: #fff;
          }
        }

        // 动态信息
        .uc-info {
          display: flex;
          align-items: center;

          .uc-num {
            width: 100px;
            border-right: 1px solid #eee;
            color: #666;
            cursor: pointer;

            .uc-item-title {
              font-size: 1.3rem;
              font-weight: bold;
            }

            .uc-item-desc {
              font-size: 0.8rem;
            }
          }
        }

        // 个人简介
        .uc-user-desc {
          margin-top: 20px;
          color: #666;

          span {
            padding-left: 5px;
          }
        }
      }
    }

    // 电台
    // .uc-dj {
    //   margin: 20px 40px 0 40px;

    //   // 电台标题
    //   .uc-dj-title {
    //     display: flex;
    //     align-items: center;
    //     justify-content: space-between;
    //     border-bottom: 2px solid #ce1f08;
    //     padding: 15px 0;
    //   }

    //   .uc-dj-item {
    //     display: flex;
    //     align-items: center;
    //     border: 1px solid #eee;
    //     padding: 5px 15px;

    //     .uc-dj-item-img {
    //       width: 80px;
    //       cursor: pointer;
    //     }

    //     .uc-dj-item-name {
    //       flex: 1;
    //       color: #333;

    //       span {
    //         cursor: pointer;
    //       }
    //     }

    //     .uc-dj-item-name > span:hover {
    //       text-decoration-color: #000;
    //       text-decoration-line: underline;
    //       text-decoration-style: solid;
    //     }

    //     .uc-dj-item-read {
    //       width: 150px;
    //       font-size: 0.8rem;
    //     }

    //     .uc-dj-item-date {
    //       font-size: 0.8rem;
    //     }
    //   }

    //   .uc-dj-item:hover {
    //     background-color: rgba(0, 0, 0, 0.1);
    //   }
    // }

    // // 收藏的歌单
    // .favo-sheet {
    //   margin: 20px 40px 0 0;

    //   // 标题
    //   .favo-sheet-title {
    //     display: flex;
    //     align-items: center;
    //     justify-content: space-between;
    //     border-bottom: 2px solid #ce1f08;
    //     padding: 15px 0;
    //     margin-left: 40px;
    //   }

    //   // 列表
    //   .fs-list {
    //     display: flex;
    //     flex-wrap: wrap;

    //     .fs-item {
    //       margin: 15px 0 0 48px;

    //       // 中间的图片框
    //       .fs-box {
    //         width: 140px;
    //         height: 140px;
    //         display: flex;
    //         justify-content: space-between;
    //         align-items: flex-end;
    //         background-image: url(../../../../../assets/images/logo.jpg);
    //         background-size: cover;
    //         background-repeat: no-repeat;

    //         .fs-bottom {
    //           width: 140px;
    //           background-color: rgba(0, 0, 0, 0.4);
    //           padding: 0 5px;
    //           display: flex;
    //           align-items: center;
    //           justify-content: space-between;
    //           color: #fff;
    //           font-size: 0.8rem;

    //           .fs-bottom-left {
    //             height: 25px;
    //             display: flex;
    //             align-items: center;
    //             z-index: 100;
    //             i {
    //               margin: 0 5px 3px 0;
    //             }
    //           }

    //           .fs-bottom-right {
    //             margin: 3px 0 0 0;
    //             i {
    //               font-size: 1rem;
    //               color: #ccc;
    //               cursor: pointer;
    //             }

    //             i:hover {
    //               color: #fff;
    //             }
    //           }
    //         }
    //       }
    //     }
    //     // 描述
    //     .fs-desc {
    //       color: #000;
    //       height: 20px;
    //       margin: 10px 0;
    //       width: 140px;
    //       text-overflow: ellipsis;
    //       white-space: nowrap;
    //       overflow: hidden;
    //       cursor: pointer;
    //     }
    //     .fs-desc:hover {
    //       text-decoration-color: #000;
    //       text-decoration-line: underline;
    //       text-decoration-style: solid;
    //     }
    //   }
    // }
  }
}
